import { useState, useEffect } from "react";

import { Todo,Filters } from "../types/todo";


export function useTodosData() {
    const [todos, setTodos] = useState<Todo[]>([ ]);
    const [filter, setFilter] = useState<string>("全部");
    const [filters, ]=useState<Filters>(['全部','已完成','未完成']);




    useEffect(() => {
        setTodos([
            {
                id: 1,
                text: "Todo 1",
                done: false,
            },
            {
                id: 2,
                text: "Todo 2",
                done: false,
            },
            {
                id: 3,
                text: "Todo 3",
                done: false,
            }
        ])
    }, []);

    const addTodo = (text: string) => {
        const newTodo: Todo = {
            id: todos.length + 1,
            text,
            done: false,
        };
        setTodos([...todos, newTodo]);
    };

    const deleteTodo = (id: number) => {
        setTodos(todos.filter((todo) => todo.id !== id));
    };
    const toggleTodo = (id: number) => {
        setTodos(
            todos.map((todo) =>
                todo.id === id ? { ...todo, done: !todo.done } : todo
            )
        );
    };

    const filterTodos=()=>{
        switch (filter) {
            case '已完成':
                return todos.filter((todo) => todo.done);
            case '未完成':
                return todos.filter((todo) => !todo.done);
            default:
                return todos;
        }
    }





    return {
        filter,
        filters,
        todos,
        setFilter,
        filterTodos,
        addTodo,
        deleteTodo,
        setTodos,
        toggleTodo,
    };
}